//获取所有Card元素列表
let card = document.querySelectorAll('.card');
//随机动画列表
let animateList = ['animate__bounceInUp', 'animate__fadeInDownBig', 'animate__fadeInBottomLeft', 'animate__fadeInBottomRight', 'animate__jackInTheBox', 'animate__rollIn']

//配置项
const options = {
    root: null,
    rootMargin: '0px',
    threshold: 0.8 // 当元素 80%出现在窗口中时触发回调
};

//回调函数
function callback(entries, observer) {
    entries.forEach(entry => {
        if (entry.isIntersecting) {
            console.log(entry);
            let random = Math.floor(Math.random() * animateList.length);
            entry.target.classList.add(animateList[random])
        } else {
            entry.target.className = 'card animate__animated'
        }
    });
}

//交叉路口观察者
const observer = new IntersectionObserver(callback, options);

//添加交叉路口观察者对象
card.forEach(item => observer.observe(item));
